/**
 * 此指令试用时候必须紧挨着input标签。中间不能有间隔。并且不能被包裹在label标签中（会获取不到焦点）。
 * <input class="padding-left-right-10  inline" ng-model="data.value" type="tel" maxlength="11"/>
 * <input-clear ng-model="data.value"></input-clear>
 */
APP.directive('inputClear', ['$rootScope', '$state', '$ionicScrollDelegate', '$timeout',
  function ($rootScope, $state, $ionicScrollDelegate, $timeout) {
    return {
      restrict: 'E',
      replace: true,
      scope: {},
      require: 'ngModel',
      template: '<i class="icon ion-close-circled inputClear" ng-show="isShow" style="color: #660000;position: relative;right: 25px;margin-left: -4px;display: inline-block;width: 0"></i>',
      //template: '<img ng-src="./img/ionic.png" ng-show="isShow" style="color: #660000;position: relative;right: 25px;display: inline-block;width: 0">',
      link: function (scope, element, attr, controller) {
        scope.isShow = false;
        scope.stopHide = false;
        element.on('click', function () {
          controller.$setViewValue('');
          scope.stopHide = true;
          $timeout(function () {
            element[0].previousElementSibling.focus();
          }, 100);
        });

        console.log(element);

        ionic.on('focus', function () {
          scope.$apply(function () {
            scope.isShow = true;
          })
        }, element[0].previousElementSibling);

        ionic.on('blur', function () {
          scope.$apply(function () {
            $timeout(function () {
              if (!scope.stopHide) {
                scope.isShow = false;
              } else {
                scope.stopHide = false;
              }
            }, 100);
          })
        }, element[0].previousElementSibling);

      }
    }
  }]);
